<!-- Views -->
<div class="views">
    <!-- Your main view, should have "view-main" class -->
    <div class="view view-main">
        <!-- Top Navbar-->
        <div class="navbar">
            <div class="navbar-inner">
                <!-- We need cool sliding animation on title element, so we have additional "sliding" class -->
                <div class="center sliding">{{title}}</div>
            </div>
        </div>
        <!-- Pages container, because we use fixed-through navbar and toolbar, it has additional appropriate classes-->
        <div class="pages navbar-through toolbar-through">
            <!-- Page, "data-page" contains page name -->
            <div data-page="index" class="page">
                <!-- Scrollable page content -->
                <div class="page-content infinite-scroll">
                    <div class="list-block">
                        <ul>
                            <li>
                                <div class="item-content">
                                    <div class="item-inner">
                                        <div class="item-input">
                                            <input type="text" placeholder="计算机编号" id="pcname">
                                        </div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="item-content">
                                    <div class="item-inner">
                                        <div class="item-input">
                                            <input type="text" placeholder="选择要查看的时间段" readonly id="calendar-default">
                                        </div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="item-content">
                                    <div class="item-inner">
                                        <div class="item-input">
                                            <a href="#" class="button active" id="viewrecord">查看</a>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <!--<div class="list-block accordion-list" id="listOfRecord">-->
                    <!--旧列表容器-->
                    <!--
                            <ul>
                            </ul>
                            -->
                            
                    <div class="list-block">
                        <div id="listOfRecord">
                        </div>
                        <div class="infinite-scroll-preloader" data-distance="5">
                            <div class="preloader"></div>
                        </div>
                    </div>
                </div>

                <script type="text/template" id="template1">
                    \{{#each reco}}
                    <li class="accordion-item">
                        <a href="#" class="item-content item-link">
                            <div class="item-inner">
                                <div class="item-title">使用者:\{{student}} 上机日期:\{{lessondate.substring(0,10)}}</div>
                            </div>
                        </a>
                        <div class="accordion-item-content">
                            <div class="content-block">
                                <p>班级：\{{classname}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;计算机状态：正常</p>
                                <p>星期\{{lessonnode.substring(0,1)}}第\{{lessonnode.substring(1,2)}}节</p>
                                <p>教师:\{{teacher}}</p>
                                <p>课程内容：\{{lessonname}}</p>
                            </div>
                        </div>
                    </li>
                    \{{/each}}
                </script>

                <script type="text/template" id="template2">
                    \{{#each reco}}
                    <div class="card">
                        <div class="card-header row" style="font-size:14px">
                            <div class="col-50">上机日期：\{{lessondate.substring(0,10)}}</div>
                            <div class="col-50">学生：\{{student}}</div>
                        </div>
                        <div class="card-content">
                            <div class="card-content-inner">
                                <div class="row">
                                    <div class="col-auto">计算机状态：正常</div>
                                    <div class="col-auto">节次：星期\{{lessonnode.substring(0,1)}}第\{{lessonnode.substring(1,2)}}节</div>
                                </div>
                                <div class="row">
                                    <div class="col-auto">班级：\{{classname.substring(2,10)}}</div>
                                    <div class="col-auto">教师：\{{teacher}}</div>
                                </div>
                                <div class="row">
                                    <div class="col-100">课程内容：
                                        <br><span style="margin-left:28px">\{{lessonname}}</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-footer">
                            上机时间：\{{lessontime lessonnode}}
                        </div>
                    </div>
                    \{{/each}}
                </script>
                </div>
            </div>
        </div>
    </div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>   
    <script type="text/javascript" src="/js/f7/js/my-app.js"></script>
    <script type="text/javascript" src="/js/f7/f7-Upscroller-Plugin/upscroller.min.js"></script>